<template>
  <div class="container">
    <div class="result-cont">
      <img  class="result-cont-img" src="../assets/images/common/success.png" alt="">
      <div class="result-cont-desc">
        <div class="title">
          {{ type === 1 ? '申请已提交' : '额度测算中' }}
        </div>
        <div class="text">
          申请结果将以短信形式发送到182****1082
          请注意查收
        </div>
      </div>
    </div>
    <div class="tips">
      您可以在首页>申请进度中查询中查询申请进度
    </div>

    <div
      class="loan-btn active"
      @click="toNext"
    >
      返回首页
    </div>

    <servicer />
  </div>
</template>

<script>
import Servicer from '@/components/Servicer'

export default {
  components: {
    Servicer
  },
  data () {
    return {
      type: 1 // 1 - 申请已提交, 2 - 额度测算中
    }
  },
  mounted () {
    const { type = 1 } = this.$route.query
    this.type = type
  },
  methods: {
    toNext () {
      if (!this.canNext) return
      this.$router.push({
        path: '/credential'
      })
    }
  }
}
</script>

<style lang="less" scoped>
.result-cont {
  padding: 40px 28px 40px 40px;
  color: #fff;
  background-image: url("../assets/images/loan/border_pck3.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-color: none;
  text-align: center;

  .result-cont-img{
    display: block;
    width: 98px;
    margin: 0 auto 16px;
  }

  .result-cont-desc{
    .title{
      margin: 0 0 16px 0;
      font-size: 20px;
      color: rgba(255,255,255,0.85);
      text-align: center;
      line-height: 28px;
    }
    .text{
      font-size: 14px;
      color: rgba(255,255,255,0.85);
      text-align: center;
      line-height: 22px;
    }
  }
}

.loan-btn {
  display: block;
  margin: 42px auto;
  width: 192px;
  height: 70px;
  line-height: 70px;
  // border: 1px solid #ccc;
  background-image: url("../assets/images/loan/btn.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-color: none;
  color: ccc;
  font-size: 20px;

  &.active {
    color: #fff;
    background-image: url("../assets/images/loan/btn_active.png");
  }
}

.tips{
  margin: 10px 0 0 0;
  font-size: 13px;
  color: #FFFFFF;
  line-height: 20px;
  text-align: left;
}
</style>
